<template>
	<view class="homegoodslist" v-if="Object.keys(goods).length !== 0">
		<view
			v-for="item in goods"
			class="homelist"
			@click="ClickSubdetail(item.id)"
		>
			<view >
		<!-- <image mode="widthFix"  class="goodsimg" :src="item.cover_url ||defaultPic" /> -->
		<wu-image
		    :show-loading="true"
		   mode="widthFix"  class="goodsimg" :src="item.cover_url ||defaultPic"
			width="100rpx"
			height="100rpx"
		  ></wu-image>
	</view>
			<view class="list">
				<text class="title">{{ item.title }}</text>
				<view class="item">
					<text class="price">￥{{item.price }}</text>
					<text class="sales">销量：{{item.sales }}</text>
				</view>
			</view>
		</view>
	</view>
</template>
<script setup>
import {ref} from 'vue'
const defaultPic = ref(
	'https://img3.doubanio.com/f/movie/8dd0c794499fe925ae2ae89ee30cd225750457b4/pics/movie/celebrity-default-medium.png'
);
const props = defineProps({
	goods: {
		type: Array,
		default: []
	}
});
const ClickSubdetail = (id) => {
console.log(id);
	uni.navigateTo({
		url:'/pages/cate/childer/details/details?id=' + id
	})
};
</script>
<style lang="scss">
.homegoodslist {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	width: 100%;

	.homelist {
		width: 50%;
		box-sizing: border-box;
		padding: 10px;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	.goodsimg{
	// width: 200rpx;
	// display: block;
	}
		.list {
			width: 100%;
		}
		.title {
			padding: 10px 0;
			font-weight: bold;
			text-align: center;
			display: inline-block;
			white-space: nowrap;
			width: 100%;
			font-size: 20rpx;
			overflow: hidden;
			text-overflow: ellipsis;
		}
		.item {
			display: flex;
			justify-content: space-around;
			font-size: 18rpx;
			.price{
				color: red;
			}
		}
	}
}
</style>
